<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@ page contentType="text/html;charset=UTF-8" language="java"  pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="spring" uri="/WEB-INF/lib/spring.tld"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="f" %>
<%@ taglib prefix="z" uri="/WEB-INF/lib/zerdoor.tld"%>
<c:set value="${pageContext.request.contextPath}" var="path" scope="page"/>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>作品评价</title>
    <link href="${path}/style/acg/css/style.css" rel="stylesheet" type="text/css" />
    <%--<script src="${path}/js/jquery.min.js" type="text/javascript"></script>--%>
    <%--<script type="text/javascript" src="${path}/style/acg/js/common.js"></script>--%>

    <script type="text/javascript">


        //保存评价信息
        function f_saveAppraise(){

            var data = $("#form1").serialize();

            data += "&works_id=${works_id}";

            $.post("${path}/itemAppraise/addWorksAppraise.html",
                    data
                    ,function(data){

                        if(data == "success"){
                            alert("<spring:message code='appraise.message.msg1' />");
                            closeWin();
                        }else{
                            alert("<spring:message code='appraise.message.msg2' />");
                        }

                    });

        }

    </script>
</head>


<body>

<div id="container">
    <div class="wrapper" style="width: 500px;">
        <div class="referbidbox">
            <form id="form1" name="form1"  method="POST">
                <div class="referform nomorder" style="padding: 0px 0px;">
                    <ul>
                        <li class="formli">
                            <dl class="clearfix">
                                <dt><spring:message code='appraise.message.msg4' /></dt>
                                <dd class="clearfix" style="width: auto;" >
                                    <c:set value="5" var="total_appraise" scope="page" ></c:set>
                                    <c:if test="${worksAppraise.total_appraise != '' && worksAppraise.total_appraise != null}">
                                        <c:set value="${worksAppraise.total_appraise}" var="total_appraise" scope="page" ></c:set>
                                    </c:if>

                                    <input id="rating" name="total_appraise" value="${total_appraise}" type="hidden">
                                    <ul class="Star">
                                        <li style="margin-bottom: 0px;"><span class="Select2"> <a onmouseover="javascript:setProfix('star_');showStars(1,'rating');" onmouseout="javascript:setProfix('star_');clearStars('rating');" href="javascript:setProfix('star_');setStars(1,'rating');"><img id="star_1" title="<spring:message code='appraise.message.msg5' />(1)" src="${path}/style/acg/images/icon_star_1.gif"></a><a onmouseover="javascript:setProfix('star_');showStars(2,'rating');" onmouseout="javascript:setProfix('star_');clearStars('rating');" href="javascript:setProfix('star_');setStars(2,'rating');"><img id="star_2" title="<spring:message code='appraise.message.msg6' />(2)" src="${path}/style/acg/images/icon_star_1.gif"></a><a onmouseover="javascript:setProfix('star_');showStars(3,'rating');" onmouseout="javascript:setProfix('star_');clearStars('rating');" href="javascript:setProfix('star_');setStars(3,'rating');"><img id="star_3" title="<spring:message code='appraise.message.msg7' />(3)" src="${path}/style/acg/images/icon_star_1.gif"></a><a onmouseover="javascript:setProfix('star_');showStars(4,'rating');" onmouseout="javascript:setProfix('star_');clearStars('rating');" href="javascript:setProfix('star_');setStars(4,'rating');"><img id="star_4" title="<spring:message code='appraise.message.msg8' />(4)" src="${path}/style/acg/images/icon_star_1.gif"></a><a onmouseover="javascript:setProfix('star_');showStars(5,'rating');" onmouseout="javascript:setProfix('star_');clearStars('rating');" href="javascript:setProfix('star_');setStars(5,'rating');"><img id="star_5" title="<spring:message code='appraise.message.msg9' />(5)" src="${path}/style/acg/images/icon_star_1.gif"></a> </span></li>
                                    </ul>
                                </dd>
                            </dl>
                        </li>

                        <li class="formli">
                            <dl class="clearfix">
                                <dt><spring:message code='appraise.message.msg10' /></dt>
                                <dd style="width: auto;">
                                    <textarea class="text_con" style="width: 300px;height: 100px;" id="content"
                                              name="content"
                                            <c:if test="${worksAppraise.content != null }"> disabled="disabled" </c:if>

                                            >${worksAppraise.content}</textarea>
                                </dd>
                            </dl>
                        </li>
                        <c:if test="${worksAppraise.appraise_time != null}">
                            <li class="formli">
                                <dl class="clearfix">
                                    <dt><spring:message code='appraise.message.msg11' /></dt>
                                    <dd style="width: auto;" >${worksAppraise.appraise_time}</dd>
                                </dl>
                            </li>
                        </c:if>

                        <li class="formli">
                            <dl class="clearfix">
                                <dt>&nbsp;</dt>
                                <dd class="clearfix" style="width:auto;">
                                    <c:if test="${worksAppraise.id == null || worksAppraise.id == ''}">
                                        <input type="button" onclick="f_saveAppraise()" id="" name="" value="<spring:message code='appraise.message.msg12' />" class="submitnext" />
                                    </c:if>

                                </dd>
                            </dl>
                        </li>
                    </ul>
                </div>
            </form>
        </div>

    </div>
</div>

<script language="javascript">
    var sArray = new Object;
    sArray[0] = new Image;
    sArray[0].src = "${path}/style/acg/images/icon_star_1.gif";
    for (var i=1; i<6; i++) {
        sArray[i] = new Image();
        sArray[i].src = "${path}/style/acg/images/icon_star_2.gif";
    }
    var starTimer;
    var pro ;
    var rate ;
    $(function() {

        initStar();

        <c:if test="${worksAppraise.id != null && worksAppraise.id != ''}">
        $('.Select2 a').unbind("mouseover");
        $('.Select2 a').unbind("mouseout");
        $('.Select2 a').attr("href","javascript:void(0)");
        </c:if>

    });
    function initStar() {
        try {
            setProfix("star_");
            setStars(document.getElementById("rating").value,'rating');
//            setProfix("taste_");
//            setStars(document.getElementById("service_attitude").value,'service_attitude');
//            setProfix("speed_");
//            setStars(document.getElementById("work_speed").value,'work_speed');
//            setProfix("quality_");
//            setStars(document.getElementById("finish_quality").value,'finish_quality');
        } catch(e){
        }
    }
    function showStars(starNum,rate) {
        try {
            clearStarTimer();
            greyStars();
            colorStars(starNum);
        } catch(e){}
        //setStars(starNum,rate);
    }
    function setProfix(profix) {
        pro = profix ;
    }
    function colorStars(starNum) {
        try {
            for (var i=1; i <= starNum; i++) {
                var tmpStar = document.getElementById(pro + i);
                tmpStar.src = sArray[starNum].src;
            }
        } catch(e){}
    }
    function greyStars() {
        try {
            for (var i=1; i<6; i++) {
                var tmpStar = document.getElementById(pro + i);
                tmpStar.src = sArray[0].src;
            }
        } catch(e){}
    }
    function greyAll(curpro,currate) {
        try {
            document.getElementById(currate).value ="";
            for (var i=1; i<6; i++) {
                var tmpStar = document.getElementById(curpro + i);
                tmpStar.src = sArray[0].src;
            }
        } catch(e){}
    }
    function setStars(starNum,rate) {
        rate = rate ;
        try {
            clearStarTimer();
            var rating = document.getElementById(rate);
            rating.value = starNum;
            showStars(starNum);
        } catch(e){}
    }
    function clearStars(currate) {
        rate = currate ;
        try {
            var rating = document.getElementById(rate);
            if (rating.value != '') {
                setStars(rating.value,rate);
            } else {
                greyStars();
            }
        } catch(e){}
    }
    function resetStars() {
        try {
            clearStarTimer();
            var rating = document.getElementById(rate);
            if (rating.value != '') {
                setStars(rating.value,rate);
            } else {
                greyStars();
            }
        } catch(e){}
    }
    function clearStarTimer() {
        if (starTimer) {
            clearTimeout(starTimer);
            starTimer = null;
        }
    }
</script>
</body>
</html>
